<template>
  <el-dialog title="查看" :close-on-click-modal="false" :visible.sync="visible" class="view" center>
    <div>
      <p>
        <span>书籍编号</span>:
        <span>{{id}}</span>
      </p>
      <p>
        <span>书籍名称</span>:
        <span>{{bookName}}</span>
      </p>
      <p>
        <span>书籍作者</span>:
        <span>{{author}}</span>
      </p>
      <p>
        <span>讲师</span>:
        <span>{{speaker}}</span>
      </p>

      <p>
        <span>书籍章节数</span>:
        <span>{{chapterNumber}}</span>
      </p>
      <p>
        <span>书籍封面</span>:
        <span>
          <img
            :src="coverUrl"
            style="width: 40px; height: 40px;vertical-align: middle;"
          >
        </span>
      </p>
      <p>
        <span>书籍字数</span>:
        <span>{{wordNumber}}</span>
      </p>
      <div class="types">
        <span>书籍类型</span>:
        <div v-for="(item,index) in booklist" :key="item.categoryName" style="diaplay:inline-block">
          <span style="diaplay:inline-block">{{item.categoryName}}</span>
          <span v-if="index < booklist.length - 1">、&nbsp;</span>
        </div>
      </div>
      <div>
        <span>是否推荐</span>:
        <div v-if="recommend==null" class="inline">--</div>
        <div v-else class="inline">
          <span v-if="recommend.type==1">免费推荐</span>
          <span v-if="recommend.type==2">周推荐</span>
          <span v-if="recommend.type==3">新书推荐</span>
        </div>
      </div>
      <p>
        <span>是否免费</span>:
        <span v-if="isFree==1">免费</span>
        <span v-else>收费</span>
      </p>
      <p>
        <span>有无视频</span>:
        <span v-if="hasVideo==1">有</span>
        <span v-else>无</span>
      </p>
      <p>
        <span>初始访问量</span>:
        <span>{{bookVisit}}</span>
      </p>
      <p>
        <span>初始热度量</span>:
        <span>{{bookHeat}}</span>
      </p>
      <p>
        <span>前台展示访问量</span>:
        <span>{{bookVisitAllCount}}</span>
      </p>
      <p>
        <span>实际访问量</span>:
        <span>{{bookVisitCount}}</span>
      </p>
      <p>
        <span>点赞量</span>:
        <span>{{supportCount}}</span>
      </p>
      <p>
        <span>收藏量</span>:
        <span>{{collectionCount}}</span>
      </p>
      <p>
        <span>分享次数</span>:
        <span>{{shareNumber}}</span>
      </p>
      <div>
        <span>推荐文案</span>:
        <div v-if="recommend==null" class="inline">--</div>
        <div v-else class="inline">
         <span>{{recommend.info}}</span>
        </div>
      </div>
      <p>
        <span>书籍简介</span>:
        <span v-html="briefIntroduction" style="height:300px;overflow:auto"></span>
      </p>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false" style="text-align:center">返回</el-button>
    </span>
  </el-dialog>
</template>
<style>
.inline{
  display: inline;
}
.types div{
  display: inline;
}
</style>

<script>
export default {
  data() {
    return {
      visible: false,
      id: "",
      bookName: "",
      coverUrl: "",
      author: "",
      speaker: "",
      chapterNumber: "",
      wordNumber: "",
      bookVisit: "",
      bookHeat: "",
      booklist: [],
      recommend: {
        type: "",
        info: ""
      },
      isFree: "",
      isAlive: "",
      gmtCreated: "",
      gmtUpdate: "",
      shareNumber: "",
      bookVisitAllCount: "",
      bookVisitCount: "",
      supportCount: "",
      collectionCount: "",
      briefIntroduction:'',
      hasVideo:'',
    };
  },
  methods: {
    init(data) {
      this.id = data.id || 0;
      this.hasVideo = data.hasVideo;
      console.log(this.hasVideo)
      this.visible = true;
      this.$nextTick(() => {
        // this.$refs["dataForm"].resetFields();
        // if (this.dataForm.id) {
        this.$http({
          url: this.$http.adornUrl(`/course/bookinfo/see/${this.id}`),
          method: "get",
          params: this.$http.adornParams()
        }).then(({ data }) => {
          if (data && data.code === 0) {
            this.id = data.bookInfoVo.id;
            this.bookName = data.bookInfoVo.bookName;
            this.bookHeat = data.bookInfoVo.bookHeat;
            this.coverUrl = data.bookInfoVo.coverUrl;
            this.bookVisit = data.bookInfoVo.bookVisit;
            this.type = data.bookInfoVo.type;
            this.isFree = data.bookInfoVo.isFree;
            this.info = data.bookInfoVo.info;
            this.author = data.bookInfoVo.author;
            this.collectionCount = data.bookInfoVo.collectionCount;
            this.supportCount = data.bookInfoVo.supportCount;
            this.bookVisitCount = data.bookInfoVo.bookVisitCount;
            this.bookVisitAllCount = data.bookInfoVo.bookVisitAllCount;
            this.shareNumber = data.bookInfoVo.shareNumber;
            this.gmtUpdate = data.bookInfoVo.gmtUpdate;
            this.gmtCreated = data.bookInfoVo.gmtCreated;
            this.recommend = data.bookInfoVo.recommend;
            this.briefIntroduction = data.bookInfoVo.briefIntroduction;
            this.wordNumber = data.bookInfoVo.wordNumber;
            this.chapterNumber = data.bookInfoVo.chapterNumber;
            this.speaker = data.bookInfoVo.speaker;
            this.booklist = data.bookInfoVo.categoryList;
          }
        });
        // }
      });
    }
  }
};
</script>
